<template>
<div class="a-list">
<el-table  :data="pools" highlight-current-row  style="width: 100%;">
			<el-table-column type="index" width="200">
			</el-table-column>
			<el-table-column prop="name" label="池子名称" width="200" sortable>
			</el-table-column>
			<el-table-column label="操作" width="200">
				<template scope="scope">
					<!--<el-button size="small" @click="checkpool(scope.$index, scope.row)">查看池子</el-button>-->
					<el-button size="small" @click="checkpool(scope.row.poolid, scope.row.labelid)">查看池子</el-button>
				</template>
			</el-table-column>
</el-table>

</div>


</template>

<script>
import axios from 'axios'
import store from './vuex/store'
import VueRouter from 'vue-router'

const myApi = axios.create({
  baseURL: 'http://localhost:8081',
  withCredentials: true,
  headers: {
    'Accept' : 'application/json',
    'Content-Type': 'application/json',
  }
});

export default {
 data () {
    return {
          pools:[],
        }
    },
    methods:{
		checkpool(a,b){
      var axiosThis = this;
      myApi.get('/pool/getPoolById',
        {
           params:{
              'poolid':a,
           }
        })
                  .then(function(response){
                      var name = response.data.name;
                      axiosThis.$store.dispatch('setname',{ 
                     'name' : name,
                     }); 
                  })
                  .catch(function(error){
                  });
			this.$store.dispatch('setpool' , { 
                      'pool' : a,
                      });
      this.$store.dispatch('setlabel' , { 
                     'label' : b,
                     });
			this.$router.push('/pool');
		},
    },
    created: function() {
		var axiosThis = this;
		myApi.get('/pool/getAllFocusPools',
        {
           params:{
              'uid':axiosThis.$store.state.userinfo.uid,
           }
        })
                  .then(function(response){
                      axiosThis.pools = response.data; 
                  })
                  .catch(function(error){
                  });
    }
}
</script>

<style>
.a-list{
  width: 60%;   
  height: 60%;  
  min-width: 200px;  
  max-width: 600px;
  padding: 40px;  
  margin-left: auto; 
  margin-right: auto;
}

</style>